import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import { createBrowserRouter, RouterProvider } from 'react-router-dom';
import { Home } from './pages/home/home.tsx';
import { ErrorPage } from './pages/errorPage/errorpage.tsx';
import { AuthLayout } from './components/layout/auth/authLayout.tsx';
import { Login } from './pages/login/login.tsx';
import { Register } from './pages/register/register.tsx';
import { Layout } from './components/layout/layout.tsx';
import { Cart } from './pages/cart/cart.tsx';
import { Provider } from 'react-redux';
import { store } from './store/index.ts';

const router = createBrowserRouter([
	{
		path: '/',
		element: <Layout />,
		children: [
			{
				path: '/',
				element: <Home />
			},
			{
				path: '/cart',
				element: <Cart />
			}
		]
	},
	{
		path: '/auth',
		element: <AuthLayout />,
		children: [
			{
				path: 'login',
				element: <Login />
			},
			{
				path: 'register',
				element: <Register />
			}
		]
	},
	{
		path: '*',
		element: <ErrorPage />
	}
]);

ReactDOM.createRoot(document.getElementById('root')!).render(
	<React.StrictMode>
		<Provider store={store}>
			<RouterProvider router={router} />
		</Provider>
	</React.StrictMode>
);
